@layout('layouts.clearly')

@section('head-zone')

<script type="text/javascript">
    $(function () {
        $('#slider').nivoSlider({
            directionNav: false,
            animSpeed: 800,
            pauseTime: 6000
        });
    });
</script>
@endsection

@section('content')
<div class="clear-fix">
    <div class="column w640 fl-left h100">
        <div id="slider" class="nivoSlider">
            @foreach (Slide::all() as $slide)
            <a href="{{ Slide::makeUrl($slide) }}">
                <img src="{{ asset($slide->url) }}" alt="{{ $slide->description }}"
                     title="{{ $slide->description }}"/>
            </a>
            @endforeach
        </div>
    </div>

    <div class="column w300 fl-right sponsors">
        <div class="row clear-fix">
            <div class="w300 sponsor big">
                <h2>Nhà tài trợ</h2>

                <p>
                    <a href="{{ asset('lien-he') }}">Hãy liên hệ ngay với chúng tôi để trở thành nhà tài trợ dịch vụ và
                        đặt Logo ở đây</a>
                </p>
            </div>
        </div>
        <div class="row clear-fix">
            <div class="sponsor fl-left">
                <a href="http://cit.ctu.edu.vn/" target="_blank">
                    <img src="{{ asset('img/logos/cit150.jpg') }}" alt="Khoa CNNT & TT">
                </a>
            </div>
            <div class="sponsor fl-right">
                <a href="http://diaoc60s.net/" target="_blank">
                    <img src="{{ asset('/img/logos/diaoc60s.gif') }}" alt="Địa Ốc 60s logo">
                </a>
            </div>
        </div>
    </div>
</div>

<div class="clear-fix" id="index-view">
    <div id="home-houses-list" class="w640 fl-left">
        <h2>Nhà trọ mới cập nhật</h2>
        <ul class="no-style" id="houses-list">
            @foreach ($houses as $house)
            <li class="clear-fix item">
                <div class="info fl-left">
                    <a class="thumb dis-block fl-left" href="{{ $house->url }}">
                        <img src="{{ $house->random_image }}" alt="Nha tro thumb"/>
                    </a>

                    <div class="intro">
                        <a class="dis-block house-name" href="{{ $house->url }}">{{ $house->name }}</a>

                        <p class="describe">{{ $house->intro }}</p>

                        <p class="address">{{ $house->address }}</p>
                    </div>
                </div>
                <ul class="meta no-style fl-right">
                    <li>
                        <span class="label">Diện tích</span>
                        <span class="value">{{ $house->room_area_statistic }}</span>
                    </li>
                    <li>
                        <span class="label">Phòng trống</span>
                        <span class="value">{{ $house->room_calc('blank', 'count') }}</span>
                    </li>
                    <li>
                        <span class="label">Giá phòng</span>
                        <span class="value">{{ $house->room_price_statistic }}</span>
                    </li>
                    <li>
                        <span class="label">Tiện nghi</span>
                        <span class="value" title="{{ $house->facilities() }}">
                            {{ Str::words($house->facilities(), 4) }}

                        </span>
                    </li>
                </ul>
            </li>
            @endforeach
        </ul>
        <!-- houses list -->
    </div>

    <div id="index-news" class="w300 fl-right">
        <h2>Tin tức mới</h2>

        <ul id="homepage-news-list" class="no-style">
            @foreach ($news as $at)
            <li class="clear-fix item">
                <a href="{{ $at->friendly_url }}" class="thumb dis-block fl-left">
                    <img src="{{ $at->thumbnail }}" alt="$at->title"/>
                </a>
                <a class="news-title" href="{{ $at->friendly_url }}">{{ $at->title }}</a>

                <div class="brief">
                    {{ $at->brief }}
                </div>
            </li>
            @endforeach
        </ul>
    </div>
</div>
@endsection